<template>
    <div class="">
        <h2>孙子组件</h2>
        <p>孙子组件接受的数据:{{ getCount }}</p>
        <button @click="grandChangeFun">孙组件修改数据</button>

    </div>
</template>

<script setup>
// import { inject, provide, ref } from 'vue'
import { inject } from 'vue'
let getCount = inject('count');
console.log(getCount.value);
// 定义孙组件的数据
// let grandMsg = ref('grand');

// 不可以使用
// provide('grandMsg', grandMsg)

let changeCountFun = inject('changeCount');

let grandChangeFun = () => {
    // console.log(getCount.value);
    // changeCountFun(getCount.value + 1)
    changeCountFun('孙子组件传递的数据')
}


</script>

<style lang="less" scoped>

</style>
